<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min1.css"/>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
		<link rel="icon" href="img/position/favicon.ico" />
		<script src="js/jquery-3.3.1.js"></script>
		<script src="js/bootstrap.js"></script>
		
	</head>
	<body>
		<header>
			<img src="img/imgxx/menu.png" class="menu"/>
			<div class="menus">
				<p class="li"><a href="index.html">首页</a><button type="button" class="close" aria-label="Close"><span aria-hidden="true">&times;</span></button></p>
				<p class="li"><a href="index5.html" target="_blank">发现</a></p>
					<p class="li1"><a href="">平面</a></p>
					<p class="li1"><a href="">UI</a></p>
					<p class="li1"><a href="">插画</a></p>
					<p class="li1"><a href="">动漫</a></p>
					<p class="li1"><a href="">摄影</a></p>
					<p class="li1"><a href="">空间</a></p>
					<p class="li1"><a href="">工业/产品</a></p>
					<p class="li1"><a href="">三维</a></p>
					<p class="li1"><a href="">手工艺</a></p>
					<p class="li1"><a href="">纯艺术</a></p>
					<p class="li1"><a href="">服装</a></p>
					<p class="li1"><a href="">其他</a></p>
					<p class="li1"><a href="">精选作品</a></p>
					<p class="li1"><a href="">精选文章</a></p>
					<p class="li1"><a href="">精选收藏</a></p>
				<p class="li"><a href="pzk1.html">同城</a></p>
				<p class="li"><a href="position.html">职位</a></p>
					<p class="lis"><a href="">职位</a></p>
					<p class="lis"><a href="">公司</a></p>
					<p class="lis"><a href="">+发布职位</a></p>
				<p class="li"><a href="pzk2.html">活动</a></p>
					<p class="lis"><a href="index6.html">设计大赛</a></p>
					<p class="lis"><a href="">公司专题策划</a></p>
					<p class="lis"><a href="">线上活动</a></p>
					<p class="lis"><a href="">线下活动</a></p>
					<p class="lis"><a href="">需为吸引瓶</a></p>
				<p class="li"><a href="index3.html">正版素材</a></p>
					<p class="lis"><a href="index3.html" target="_blank">图片</a></p>
					<p class="lis"><a href="">视频</a></p>
					<p class="lis"><a href="index4.html" target="_blank">字体</a></p>
					<p class="lis"><a href="">音乐</a></p>
				<p class="li"><a href="course.html" target="_blank">课程</a></p>
					<p class="lis"><a href="">正在热销</a></p>
					<p class="lis"><a href="">口碑好课</a></p>
				<p class="li"><a href="">...</a></p>	
					<p class="lis"><a href="榜单.html">榜单</a></p>
					<p class="lis"><a href="设计师.html">设计师</a></p>
					<p class="lis"><a href="站酷APP.html">站酷APP</a></p>
					<p class="lis"><a href="字体库.html">站酷字体</a></p>
			</div>
			<img src="img/imgxx/logo.svg" class="pull-left logo"/>
			<nav class="pull-left">
				<ul class="nav pull-left clearfix">
					<li>
						<a href="index.html">首页</a>
					</li>
					<li>
						<a href="index5.html" target="_blank">发现</a>
						<div class="fx">
							<div class="top">
								<div><a href="">平面</a><span>|</span></div>	
								<div><a href="">UI</a><span>|</span></div>	
								<div><a href="">网页</a><span>|</span></div>	
								<div><a href="">插画</a><span>|</span></div>	
								<div><a href="">动漫</a><span>|</span></div>	
								<div><a href="">摄影</a><span>|</span></div>	
								<div><a href="">空间</a><span>|</span></div>	
								<div><a href="">工业/产品</a><span>|</span></div>	
								<div><a href="">三维</a><span>|</span></div>	
								<div><a href="">影视</a><span>|</span></div>	
								<div><a href="">手工艺</a><span>|</span></div>	
								<div><a href="">纯艺术</a><span>|</span></div>	
								<div><a href="">服装</a><span>|</span></div>	
								<div><a href="">其他</a><span>|</span></div>	
											
							</div>
							<hr/>
							<div class="bottom">
								<a href="">精选作品&nbsp;></a>
								<a href="">精选文章&nbsp;></a>
								<a href="">精选收藏&nbsp;></a>
							</div>
						</div>
					
					</li>
					<li><a href="pzk1.html">同城</a></li>
					<li>
						<a href="position.html">职位</a>
						<div class="zw">
							<p><a href="">职位</a></p>
							<p><a href="">公司</a></p>
							<p><a href="">+发布职位</a></p>
						</div>
					</li>
					<li>
						<a href="pzk2.html">活动</a>
						<div class="zw">
							<p><a href="index6.html">设计大赛</a></p>
							<p><a href="">公司专题策划</a></p>
							<p><a href="">线上活动</a></p>
							<p><a href="">线下活动</a></p>
							<p><a href="">学习音频</a></p>
						</div>
					</li>
					<li>
						<a href="index3.html">正版素材</a>
						<div class="zw">
							<p><a href="index3.html" target="_blank">图片</a></p>	
							<p><a href="">视频</a></p>
							<p><a href="index4.html" target="_blank">字体</a></p>
							<p><a href="">音乐</a></p>
						</div>
					</li>
					<li>
						<a href="course.html" target="_blank">课程</a>
						<div class="zw">
							<p><a href="">正在热销</a></p>
							<p><a href="">口碑好课</a></p>
						</div>
					</li>
					<li>
						<a href=""></a>
						<div class="zw">
							<p><a href="榜单.html">榜单</a></p>
							<p><a href="设计师.html">设计师</a></p>
							<p><a href="站酷APP.html">站酷APP</a></p>
							<p><a href="字体库.html">站酷字库</a></p>
						</div>
					</li>
				</ul>
			</nav>
			
			<div class="log">
				<a href=""></a>
			</div>
			<div class="log">
				<a href=""></a>
			</div>
			<span><a href="">登录</a>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<a href="">注册</a></span>
			<div class="search">
				<div class="search_top">
					<button type="button" class="close" aria-label="Close"><span aria-hidden="true">&times;</span></button>
					<input type="text" name="" id="" />
					<img src="img/imgxx/seach.svg"/>
				</div>
					<div class="search_bot">
						<div class="search1">热门搜索</div>
						<div class="search2">2019毕业展</div>
						<div class="search2">青春答卷2018</div>
						<div class="search2">2018毕业展</div>
						<div class="search2">青春答卷2018</div>
						<div class="search2">我是毕业生</div>
					</div>
			</div>
		</header>
		
		<article>	
		<section class="section1 container">
			<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
			  <div class="carousel-inner" role="listbox">
			    <div class="item active">
			      <img src="img/imgxx/lunbo1.jpg" alt="">
			    </div>
			    <div class="item">
			      <img src="img/imgxx/lunbo2.jpg" alt="">
			    </div>
			     <div class="item">
			      <a href="index3.html" target="_blank">
			     	 <img src="img/imgxx/lunbo3.jpg" alt="">
			      </a>
			    </div>
			     <div class="item">
			      <img src="img/imgxx/lunbo4.jpg" alt="">
			    </div>
			    <div class="item">
			      <img src="img/imgxx/lunbo5.jpg" alt="">
			    </div>
			    <div class="item">
			      <img src="img/imgxx/lunbo6.jpg" alt="">
			    </div>
			  </div>
			  <!-- Controls -->
			  <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
			    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
			    <span class="sr-only">></span>
			  </a>
			  <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
			    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
			    <span class="sr-only"><</span>
			  </a>
			</div>	
		</section>
		<section class="section2 container ">
			<div class="row">
			<div class="col-lg-2 col-md-3 col-sm-5"><a href="index2.html" target="_blank"><img src="img/imgxx/xiaoz.jpg"/></a></div>
			<div class="col-lg-2 col-md-3 col-sm-5"><img src="img/imgxx/sec2.jpg"/></div>
			<div class="col-lg-2 col-md-3 col-sm-5"><img src="img/imgxx/sec3.jpg"/></div>
			<div class="col-lg-2 col-md-3 col-sm-5"><img src="img/imgxx/sec4.jpg"/></div>
			<div class="col-lg-2 col-md-3 col-sm-5"><img src="img/imgxx/sec5.jpg"/></div>
			</div>
		</section>
		</article>	
			<div class="recommends">				
				<div class="recommend">
					<a href="">首页推荐</a>
					<a href="">最新发布</a>
					<a href="">上升最快</a>
					<div class="pull-right">
					<img src="https://img.zcool.cn/community/018cd15d401a4aa80120695cbad09e.gif"/>
					</div>
				</div>
				</div>
		<section class="section2 container secc">
			<div class="row row1">
			<div class="col-lg-2 col-md-3 col-sm-5 row2">
				<img src="img/imgxx/row1.jpg"/>
				<div class="row_bot">
					<p class="p1">电影《刺杀小说家》概念</p>
					<p class="p2">平面-海报</p>
					<p class="p3">
						<span>297</span>
						<span>16</span>
						<span>42</span>
					</p>
				</div>
				<div class="row_bott">
					<img src="img/imgxx/logos1.jpg" alt="" />
					<a href="">远山文化</a>
				</div>
				</div>
			</div>
		</section>
		<footer>
			<div class="papgs">
				<ul>
					<li><a href="">1</a></li>
					<li><a href="">2</a></li>
					<li><a href="">3</a></li>
					<li><a href="">4</a></li>
					<li><a href="">5</a></li>
					<li><a href="">6</a></li>
					<li><a href="">7</a></li>
					<li><a href="">...</a></li>
					<li><a href="">99</a></li>
					<li><a href="">100</a></li>
					<li><a href=""></a></li>
					</ul>
				</div>
				<div class="footer0  container">
					<a href=""><img src="img/imgxx/footer0.jpg"/></a>
				</div>
				<div class="footer1">
					<div class="footer_wrap container">
						<div class="footer_wrap1">         
							<a href=""><span><img src="img/imgxx/app.svg"/></span><img src="img/imgxx/ewm.png"/>移动版</a>
							<a href="">关于我们</a>
							<a href="">加入站酷</a>
							<a href="">用户协议</a>
							<a href="">隐私政策</a>
							<a href="">侵权申诉</a>
							<a href="">企业服务</a>
							<a href="">帮助中心</a>
							<a href="">联系我们</a>
							<a href="">中文</a>
							<a href="">English</a>
						</div>
						<div class="footer_wrap2">
							<a href=""><img src="img/imgxx/ewm2.jpg"/></a>
							<a href=""></a>
						</div>
					</div>
					<div class="footer_tap container">						     
						<p>
						<a href="">京ICP备11017824号-4</a>
						<span>|</span>
						<a href="">京ICP证130164号</a>
						<span>|</span>
						<a href="">京公网安备11010502000501号</a>
						<span>|</span>
						<a href=""> 网络文化经营许可证 京网文[2016]6173-844号</a>
						<span>|</span>
						<a href="">广播电视节目制作经营许可证（京）字第06990号</a>
						</p>
						<p>
						<a href="">营业执照</a>
						<span>|</span>
						<a href="">网上有害信息举报专区</a>
						<span>|</span>
						<a href="">不良信息举报电话：010-56538658</a>
						<span>|</span>
						<a href=""> 举报邮箱 jubao@zcool.com.cn</a>
						<span>|</span>
						<a href="">联系电话：010-56538600</a>
						<span>|</span>
						<a href="">Copyright © 2006-2019 ZCOOL站酷</a>
						</p>
					</div>
						
				</div>
			</footer>
			<div class="r-top"></div>
			<script>
			//header
			//搜索图标点击出现搜索框
				$('.log:first').click(function(e){
					e.preventDefault();
					$('.search').fadeIn(1000);					
//					$(this).fadeOut(1000);
					$(".search input").click(function(e){
						 $(".search").fadeIn(1000);
						 e.stopPropagation();
	    			});
	    			$(window).click(function(e){
				        $(".search").fadeOut(1000);
					});
				});
				$(".log:first").click(function(e){
       				 e.stopPropagation();
    });
				//menus隐藏菜单栏	
				$('.menu').click(function(){
					$('.menus').addClass('menu1')
					
				});
				$('.menus .li button').click(function(){
					$('.menus').removeClass('menu1')
					
				})
				
				
				
				

				//克隆列表
			var img_src=['img/imgxx/row2.jpg','img/imgxx/row3.jpg','img/imgxx/row4.jpg','img/imgxx/row5.jpg','img/imgxx/row6.jpg','img/imgxx/row7.jpg',
					'img/imgxx/row8.jpg','img/imgxx/row9.jpg','img/imgxx/row10.jpg','img/imgxx/row11.jpg','img/imgxx/row12.jpg','img/imgxx/row13.jpg','img/imgxx/row14.jpg',
					'img/imgxx/row15.jpg','img/imgxx/row16.jpg','img/imgxx/row17.jpg','img/imgxx/row18.jpg','img/imgxx/row19.jpg','img/imgxx/row20.jpg','img/imgxx/row21.jpg',
					'img/imgxx/row22.jpg','img/imgxx/row23.jpg','img/imgxx/row24.jpg','img/imgxx/row25.jpg'];
			var p1=['OPPO RenoZ：年轻，就.........','一只“烤鸭”的潮流IP','关于设计师简历作品集那..........',
					'如何让七夕设计与情人节不','理所设计作品 | Olli Olli亲子.......','生活','京都 KYOTO','《起舞吧!齐舞》节目动画及........','LxU × 砂之盒沉浸影像展 | P.......',
					'我和吸铁石和一个死去的朋友','联想创意海报#A940星球#....','短篇漫画《Dyolan Dog ','中国酒城 天府见证','付增凯-定格肖像','爬宠','山西五台山显通寺无量殿乐.......',
					'Demon Blood 概念设计','人文抽象派之三·大画中国节','Tourist Map Illustration','华为折叠手机概念APP','BD App New feature Promo','黄太鸡——我想成为你',
					'插画小集','产品架构再设计&IP形象'];
			var p2=['三维-场景','平面-吉祥物','文章-观点-多领域','特别企划','平面-品牌','插画-商业插画','插画-插画习作','三维-动画/影视','三维-动画/影视',
					'动漫-动画片','平面-海报','动漫-短篇/四格漫画','平面-包装','摄影-人像','摄影-动物','手工艺-其他手工','插画-概念设定','插画-其他插画',
					'插画-商业插画','UI-APP界面','影视-Motion Graphic','平面-吉祥物','插画-其他插画','UI-APP界面']
			var sp1=['2132','213','213','123','889','789','200','1300','2312','321','433','688',
					'7879','141','213','213','132','214','324','78','213','421','231','123']
			var sp2=['2132','213','213','123','889','789','200','1300','2312','323','433','688',
					'7879','121','213','213','132','214','324','78','213','421','231','123']
			var sp3=['212','213','213','123','889','789','200','1300','2312','313','433','688',
					'7879','124','213','213','132','214','324','78','213','421','231','123'];
			
			for(var i=0;i<img_src.length;i++){
				var tag_clone = $('.row2').eq(0).clone(true);
				tag_clone.children('img').attr('src',img_src[i]);
				tag_clone.children('.row_bot').children('.p1').html(p1[i]);
				tag_clone.children('.row_bot').children('.p2').html(p2[i]);
				tag_clone.children('.row_bot').children('.p3').children('span:nth-of-type(1)').html(sp1[i]);
				tag_clone.children('.row_bot').children('.p3').children('span:nth-of-type(2)').html(sp2[i]);
				tag_clone.children('.row_bot').children('.p3').children('span:nth-of-type(3)').html(sp3[i]);
				$('.row1').append(tag_clone);
			}		
			//滚轮事件
				var h='';
				var i=true;
				$(window).scroll(function(){
					if(i){
						h=$('.recommends').offset().top;
						i=false;
					}
					<!--console.log(h);-->
					if($(window).scrollTop()>=800){
						$('.r-top').css('display','block');
					}
					else{
						$('.r-top').css('display','none');
					}
					
					if($(window).scrollTop()>h){
						$('.recommends').addClass('fi');
					}
					else{
						$('.recommends').removeClass('fi');	
					}	
				});
				//回到顶部
				$('.r-top').click(function(){
					$('html,body').animate({'scrollTop':'0'});

				});
		</script>
	</body>

</html>
